import Vue from 'vue';

// 浏览器语法兼容插件
import 'babel-polyfill';
// 现代规范的浏览器重置CSS样式
import 'normalize.css/normalize.css';
// 基于 Vue 2.0 的桌面端组件库
import ElementUI from 'element-ui';
// Element UI自定义主题样式
import 'element-ui/lib/theme-chalk/index.css';
// Element UI i18n国际化（中文）
import locale from 'element-ui/lib/locale/lang/zh-CN';
// Vue Markdown编辑器
import mavonEditor from 'mavon-editor';
// Vue Markdown编辑器-样式
import 'mavon-editor/dist/css/index.css';
// Vue 路由管理器
import Router from 'vue-router';

// 基础全局样式
import '@/styles/index.scss';
// 基础嵌入字体样式
import '@/styles/font.scss';
// 本体
import App from './App';
// 路由配置
import router from './router/routers';
// 权限控制
import permission from './components/Permission';
// 字典
import dict from './components/Dict';
// Vuex store
import store from './store';
// 图标库
import '@/icons';
// 权限控制脚本
import './router/index';

Vue.use(mavonEditor);
Vue.use(permission);
Vue.use(dict);
Vue.use(ElementUI, { locale });

// 阻止启动时显示生产消息
Vue.config.productionTip = false;

/**
 * 当在路由中添加了相同的路由时，
 * 会出现Navigating to current location (XXX) is not allowed"的问题，
 * 此时就需要重写路由的push方法
 */
const routerPush = Router.prototype.push;
Router.prototype.push = function push(location) {
  return routerPush.call(this, location).catch(error => error);
};

/**
 * 创建并挂载Vue的实例对象
 *
 * 以下是对h => h(App)的解释
 * ES6的写法，表示Vue实例选项对象的render方法作为一个函数，
 * 接受传入的参数h函数，返回h(App)的函数调用结果
 * Vue在创建Vue实例时，通过调用render方法来渲染实例的DOM树
 * Vue在调用render方法时，会传入一个createElement函数作为参数，
 * 也就是这里的h的实参是createElement函数，
 * 然后createElement会以App为参数进行调用
 */

/* eslint-disable no-new */
new Vue({
  el: '#app',
  router,
  store,
  render: h => h(App)
});
